<template>
	<view>
		<RentNavbarSwiper ref="navbarSwiper" :navbarList="navbarList" :curNavbar="curNavbar" :height="'88rpx'" :dateList="dateList"
		 @handleChooseNavbar="handleChooseNavbar" @handleScrolltolower="handleScrolltolower" @handleRefresherrefresh="handleRefresherrefresh">
		</RentNavbarSwiper>

		<CommonPay ref="commonPay" :price="dateInfo.waitPay" :orderInfo="orderInfo" @payMoney="payMoney" @wechatPaySuccess="wechatPaySuccess"></CommonPay>
		<CommonPay ref="commonPayAdd" :price="dateInfo.waitPay" :orderInfo="orderInfo" @payMoney="payMoney" @wechatPaySuccess="wechatPaySuccess"></CommonPay>

		<CommonBackReasonSubmit ref="submitReason" @confirm="handleSubmitBackReason"></CommonBackReasonSubmit>

		<CommonBackReasonSubmitMoney ref="submitReasonMoney" :price="cancleOrderShouldPayMoney" @confirm="handleSubmitBackReason"></CommonBackReasonSubmitMoney>

	</view>
</template>

<script>
	import CommonPay from '@/components/common/common-pay.vue'
	import CommonBackReasonSubmit from '@/components/common/common-backReason-submit.vue'
	import CommonBackReasonSubmitMoney from '@/components/common/common-backReason-submit-money.vue'
	import RentNavbarSwiper from '@/components/user/rent-navbarSwiper.vue'
	export default {
		components: {
			RentNavbarSwiper,
			CommonPay,
			CommonBackReasonSubmit,
			CommonBackReasonSubmitMoney
		},
		data() {
			return {
				navbarList: [{
						name: '待支付',
						alias: 'toBePaid'
					},
					{
						name: '司机审核',
						alias: 'audit'
					},
					{
						name: '待确认',
						alias: 'toBoConfirmed'
					},
					{
						name: '待取车',
						alias: 'waitingCar'
					},
					{
						name: '进行中',
						alias: 'processing'
					},
					{
						name: '已完成',
						alias: 'completed'
					},
					{
						name: '已取消',
						alias: 'cancelled'
					},
					{
						name: '追加订单',
						alias: 'addOrder'
					},
				],
				curNavbar: {
					name: '待支付',
					alias: 'toBePaid'
				},
				toBePaidList: [],
				auditList: [],
				toBoConfirmedList: [],
				waitingCarList: [],
				processingList: [],
				completedList: [],
				cancelledList: [],
				addOrderList: [],
				page: {
					pageNum: 0,
					totalPageNum: 0,
					pageSize: 10,
				},
				alertConfig: {
					cancleText: '我再想想',
					confirmText: '确定取消',
					content: '是否取消订单'
				},
				cancleOrderShouldPayMoney: 0,
				dateInfo: {}
			};
		},

		onLoad() {
			uni.$on('cancleOrder', (data) => { // 点击了取消订单
				this.dateInfo = data
				this.getCancelCarpoolOrderShouldPayPay()
			})
			uni.$on('showCommonPay', (data) => {
				this.dateInfo = data
				this.$refs.commonPay.show()
			})
		},
		onShow() {
			this.getOrderList()
		},
		onUnload() {
			uni.$off('cancleOrder')
			uni.$off('showCommonPay')
		},
		computed: {
			dateList() {
				return [this.toBePaidList, this.auditList, this.toBoConfirmedList, this.waitingCarList, this.processingList, this.completedList,
					this.cancelledList, this.addOrderList
				]
			},
			orderInfo() {
				let o = {
					orderNo: this.dateInfo.orderNo,
					type: 4,
					money: this.dateInfo.waitPay
				}
				return o
			},
			type() {
				let t = 0
				switch (this.curNavbar.alias) {
					case 'toBePaid':
						t = 0;
						break;
					case 'audit':
						t = 1;
						break;
					case 'toBoConfirmed':
						t = 2;
						break;
					case 'waitingCar':
						t = 3;
						break;
					case 'processing':
						t = 4;
						break;
					case 'completed':
						t = 5;
						break;
					case 'cancelled':
						t = 6;
						break;
					case 'addOrder':
						t = 7;
						break;
				}
				return t
			}
		},
		methods: {
			wechatPaySuccess() {
				this.$refs.commonPay.close()
				uni.showToast({
					title: '支付成功'
				})
				this.getOrderList()
			},
			getCancelCarpoolOrderShouldPayPay() {
				const _this = this
				if (_this.dateInfo.status == 0) {
					_this.$http.get(_this.$api.getCancelRentOrderShouldPayPay + _this.dateInfo.orderNo).then(res => {
						if (res.code === 200) {
							_this.cancleOrderShouldPayMoney = res.data.fee
							_this.$http.get(_this.$api.cancelRentOrder, {
								orderNo: _this.dateInfo.orderNo,
								// reason
							}).then(res => {
								if (res.code === 200) {
									_this.getOrderList()
								}
							})
						}
					})
				} else {
					_this.$http.get(_this.$api.getCancelRentOrderShouldPayPay + _this.dateInfo.orderNo).then(res => {
						if (res.code === 200) {
							_this.cancleOrderShouldPayMoney = res.data.fee

							switch (_this.dateInfo.status - 0) {
								case 0:
									// _this.cancleOrderCommon(); // 直接取消订单 不收服务费，
									break;
								case 2:
									_this.$refs.submitReasonMoney.show() // 提交原因，收取服务费
									break;
								default:
									{
										// _this.$refs.submitReason.show() // 提交原因 不收服务费，
										_this.$refs.submitReasonMoney.show() // 提交原因，收取服务费
									}
							}

						}
					})
				}
			},
			handleChooseNavbar(item, i) {
				this.curNavbar = item
				this.getOrderList()
			},
			handleScrolltolower(item, i) {
				let totalPage = Math.ceil(this.page.totalPageNum / this.page.pageSize)
				if (this.page.pageNum >= totalPage) return
				this.page.pageNum++
				this.getMoreOrderList()
			},
			handleRefresherrefresh(item, i) {
				this.page.pageNum = 1
				this.getOrderList()
			},
			handleSubmitBackReason(reason) { // 提交取消订单的原因
				this.cancleOrderCommon(reason)
			},
			// cancleOrder(reason) {
			// 	let data = this.dateInfo
			// 	let api = this.$api.cancelRentOrderNoPay + this.dateInfo.orderNo // 默认没有支付
			// 	if (this.dateInfo.status == 4 || this.dateInfo.status == 3) { // 订单已确认，待取车，此时取消订单需要付费
			// 		api = this.$api.cancelRentOrderPay +
			// 			`?orderNo=${this.dateInfo.orderNo}&reason=${reason}&refund=${this.cancleOrderShouldPayMoney}`
			// 	} else if (this.dateInfo.status == 1) { // 审核中，不强制提交取消理由
			// 		api = this.$api.cancelRentOrderPayAduit + `?orderNo=${this.dateInfo.orderNo}&reason=${reason}`
			// 	}
			// 	this.$http.get(api).then(res => {
			// 		if (res.code === 200) {
			// 			this.updataList(data)
			// 		}
			// 	})
			// },
			cancleOrderCommon(reason) { // 取消订单接口合并统一
				const _this = this
				// #ifdef MP-WEIXIN
				uni.requestSubscribeMessage({
					tmplIds: ['58yzFNiV-am9kUCIMJjJV1DVDbS_M27xeXkhG6Q_ruc'],
					success(res) {
						_this.submitWxNotifyConfirm('58yzFNiV-am9kUCIMJjJV1DVDbS_M27xeXkhG6Q_ruc', res[
							'58yzFNiV-am9kUCIMJjJV1DVDbS_M27xeXkhG6Q_ruc'])
						// #endif
						_this.$http.get(_this.$api.cancelRentOrder, {
							orderNo: _this.dateInfo.orderNo,
							reason
						}).then(res => {
							if (res.code === 200) {
								_this.getOrderList()
							}
						})
						// #ifdef MP-WEIXIN
					}
				})
				// #endif
			},
			getCancelRentOrderShouldPayPay() { // 获取取消订单的时候，需要付费费用
				this.$http.get(this.$api.getCancelCharteredOrderShouldPayPay + this.dateInfo.orderNo).then(res => {
					if (res.code === 200) {
						this.cancleOrderShouldPayMoney = res.data.fee
						this.$refs.submitReasonMoney.show()
					}
				})
			},
			payMoney(pwd) {
				let data = this.dateInfo
				let api = this.$api.payRentOrder
				if (data.status == 9) { // 订单追加余额支付
					api = this.$api.payRentOrderAdd
				}
				this.$http.post(api, {
					orderNo: this.dateInfo.orderNo,
					payWord: pwd,
					money: this.dateInfo.waitPay.toString()
				}).then(res => {
					if (res.code === 200) { // 密码正确，支付成功
						if (data.status == 9) {
							// this.$refs.commonPayAdd.closeKeyBoard()
							this.$refs.commonPay.closeKeyBoard()
						} else {
							this.$refs.commonPay.closeKeyBoard()
						}
						uni.showToast({
							title: '支付成功'
						})
						this.getOrderList()
						this.updataList(data)
						// setTimeout(() => {
						// 	uni.navigateTo({
						// 		url: '../../pages/order/success.order?id=' + data.orderNo + '&type=chartered'
						// 	})
						// })
					}
				})
			},
			getOrderList() {
				this.page.pageNum = 1
				this.$http.get(this.$api.getRentOrderList + '?type=' + this.type + '&pageSize=' + this.page.pageSize + '&pageNum=' +
					this.page.pageNum).then(res => {
					if (res.code === 200) {
						this.page.totalPageNum = res.data.total
						this.$refs.navbarSwiper.stopPullDownRefresh()
						if (this.curNavbar.alias === 'toBePaid') { // 待支付
							this.toBePaidList = res.data.result
						} else if (this.curNavbar.alias === 'audit') { // 租车审核
							this.auditList = res.data.result
						} else if (this.curNavbar.alias === 'toBoConfirmed') { // 待确认
							this.toBoConfirmedList = res.data.result
						} else if (this.curNavbar.alias === 'waitingCar') { // 带取车
							this.waitingCarList = res.data.result
						} else if (this.curNavbar.alias === 'processing') { // 进行中
							this.processingList = res.data.result
						} else if (this.curNavbar.alias === 'completed') { // 已完成
							this.completedList = res.data.result
						} else if (this.curNavbar.alias === 'cancelled') { // 已取消
							this.cancelledList = res.data.result
						} else if (this.curNavbar.alias === 'addOrder') { // 追加订单
							this.addOrderList = res.data.result
						}
					}
				})
			},
			getMoreOrderList() {
				this.$http.get(this.$api.getRentOrderList + '?type=' + this.type + '&pageSize=' + this.page.pageSize + '&pageNum=' +
					this.page.pageNum).then(res => {
					if (res.code === 200) {
						this.page.totalPageNum = res.data.total
						if (this.curNavbar.alias === 'toBePaid') { // 待支付
							// this.toBePaidList = res.data.result
							this.toBePaidList = [...this.toBePaidList, ...res.data.result]
						} else if (this.curNavbar.alias === 'audit') { // 租车审核
							// this.auditList = res.data.result
							this.auditList = [...this.auditList, ...res.data.result]
						} else if (this.curNavbar.alias === 'toBoConfirmed') { // 待确认
							// this.toBoConfirmedList = res.data.result
							this.toBoConfirmedList = [...this.toBoConfirmedList, ...res.data.result]
						} else if (this.curNavbar.alias === 'waitingCar') { // 带取车
							// this.waitingCarList = res.data.result
							this.waitingCarList = [...this.waitingCarList, ...res.data.result]
						} else if (this.curNavbar.alias === 'processing') { // 进行中
							// this.processingList = res.data.result
							this.processingList = [...this.processingList, ...res.data.result]
						} else if (this.curNavbar.alias === 'completed') { // 已完成
							// this.completedList = res.data.result
							this.completedList = [...this.completedList, ...res.data.result]
						} else if (this.curNavbar.alias === 'cancelled') { // 已取消
							// this.cancelledList = res.data.result
							this.cancelledList = [...this.cancelledList, ...res.data.result]
						} else if (this.curNavbar.alias === 'addOrder') { // 追加订单
							// this.addOrderList = res.data.result
							this.addOrderList = [...this.addOrderList, ...res.data.result]
						}
					}
				})
			},
			updataList(data) {
				switch (this.curNavbar.alias) {
					case 'toBePaid':
						this.toBePaidList.forEach((item, i) => {
							if (item.orderNo === data.orderNo) {
								this.toBePaidList.splice(i, 1)
							}
						})
						break
					case 'audit':
						this.auditList.forEach((item, i) => {
							if (item.orderNo === data.orderNo) {
								this.auditList.splice(i, 1)
							}
						})
						break
					case 'toBoConfirmed':
						this.toBoConfirmedList.forEach((item, i) => {
							if (item.orderNo === data.orderNo) {
								this.toBoConfirmedList.splice(i, 1)
							}
						})
						break
					case 'waitingCar':
						this.waitingCarList.forEach((item, i) => {
							if (item.orderNo === data.orderNo) {
								this.waitingCarList.splice(i, 1)
							}
						})
						break
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	* {
		touch-action: none;
	}

	.swiper-wrap {
		height: calc(100vh - 88rpx);

		.swiper {
			.swiper-item {
				.content {
					height: 100%;
					padding: 20rpx 30rpx;
					box-sizing: border-box;
				}
			}
		}
	}
</style>
